<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="utf-8">
    <title>下单</title>
    <script type="text/javascript" src="js/jquery-1.11.3.min.js" /></script>
    <script type="text/javascript">
            $(document).ready(function(){
                $(".daohang4tan").hide();
                $(".daohang5tan").hide();

                $(".daohang4,.daohang4tan").hover(function(){
                    $(".daohang4").css({"background":"white","border":"1px solid #EEEEEE"});
                    $(".daohang4tan").show();
                },function(){
                    $(".daohang4").css({"background":"#F5F5F5","border":"0px"});
                    $(".daohang4tan").hide();
                });

                $(".daohang5,.daohang5tan").hover(function(){
                    $(".daohang5").css({"background":"white","border":"1px solid #EEEEEE"});
                    $(".daohang5tan").show();
                },function(){
                    $(".daohang5").css({"background":"#F5F5F5","border":"0px"});
                    $(".daohang5tan").hide();
                });

            });
    </script>
    <style type="text/css">
        body{
            font-family:微软雅黑;
            margin:0px;
            padding:0px;
        }
        .hui{
            background: #f5f5f5;
            width:100%;
            height:40px;
            position:relative;
            margin:0px;
            border:1px solid #EEEEEE;
            position: fixed;
        }
        .daohang{
            width:420px;
            height:40px;
            position:absolute;
            right:162px;
        }
        .daohang div a{
            font-size:14px;
            margin-left:20px;
            margin-top:10px;
            text-decoration:none;
            display:block;
            color:black;
        }
        .daohang div a:hover{
            font-size:14px;
            margin-left:20px;
            margin-top:10px;
            text-decoration:none;
            display:block;
            color:#F22E00;
        }
        .daohang1{
            width:70px;
            height:40px;
            position:absolute;
        }
        .daohang2{
            width:70px;
            height:40px;
            position:absolute;
            margin-left:70px;
        }
        .daohang3{
            width:70px;
            height:40px;
            position:absolute;
            margin-left:140px;
        }
        .daohang4{
            width:110px;
            height:40px;
            position:absolute;
            margin-left:210px;
            border:0px;
        }
        .daohang5{
            width:100px;
            height:40px;
            position:absolute;
            margin-left:320px;
        }
        .daohang4tan{
            width:110px;
            height:100px;
            border:1px solid #EEEEEE;
            margin-left:210px;
            margin-top:40px;
            position:absolute;
            background:white;
            z-index:9;
        }
        .daohang5tan{
            width:100px;
            height:100px;
            border:1px solid #EEEEEE;
            margin-left:320px;
            margin-top:40px;
            position:absolute;
            background:white;
            z-index:9;
        }
        .dibu a{
            color:#3C3C3C;
            text-decoration:none;
            font-size:17px;
            font-weight:700;
            display:block;

        }

    </style>
</head>
<body>
<!--灰色导航栏-->
<div class="hui">
    <div class="daohang">
        <div class="daohang1"><a href="index.html">首页</a></div>
        <div class="daohang2"><a href="denglu.html">登录</a></div>
        <div class="daohang3"><a href="zhuce.html">注册</a></div>
        <div class="daohang4"><a href="#">我的淘兼职</a></div>
        <div class="daohang5"><a href="#">关于我们</a></div>

        <div class="daohang4tan"><a href="gerenzhongxin.html">个人中心</a><a href="#">添加修改简历</a><a href="#">查看招聘信息</a></div>
        <div class="daohang5tan"><a href="#">网站简介</a><a href="#">组织结构</a><a href="#">发展历程</a></div>
    </div>
</div>
<div class="rongqi" style="border:0px solid red;width:1024px;top:40px;height:600px;position:relative;margin:0 auto;cursor:default;">
    <img src="img/taologo.jpg" style="width:200px;">
    <h3 style="margin-top: 50px;">确认订单消息</h3>
    <div style="border-top:3px solid #b2d1ff;height: 200px;width: 1000px;background: #f2f6ff">
        <img src="img/jiajiao.jpg" width="130px;"height="130px"style="top:220px;left:20px;position: absolute">
        <p style="left:180px;top:230px;position: absolute"><b>英语家教: 女  王红 杭州电子科技大学</b></p>
        <p style="left:550px;top:250px;position: absolute">家教</p>
        <p style="left:650px;top:250px;position: absolute">工资：30元/小时</p>
        <p style="left:850px;top:250px;position: absolute">中介费：50元</p>
    </div>
    <button style="margin-top: 50px;margin-left: 700px;width: 120px;height: 30px;">确认订单</button>
    <button style="margin-top:50px;margin-left:20px;width: 120px;height: 30px;position: absolute">取消</button>
    <!--底部导航栏-->
    <div class="dibu" style="width:100%;height:140px;border:1px solid white;position:absolute;top:650px;">
        <div style="width:100%;height:12px;background:#FF5500"></div>
        <div style="width:100%;height:1px;border-top:1px dashed #FF5500;margin-top:3px;"></div>
        <img src="img/taologo.jpg" style="width:110px;border:1px solid #FF5500;margin-top:40px;margin-left:130px;">
        <a href="#" style="margin-top:-53px;margin-left:350px;">联系我们</a>
        <a href="#" style="margin-top:-22px;margin-left:470px;">加入我们</a>
        <a href="#" style="margin-top:-22px;margin-left:590px;">关注我们</a>
        <a href="#" style="margin-top:8px;margin-left:350px;">关于我们</a>
        <a href="#" style="margin-top:-22px;margin-left:470px;">友情链接</a>
        <a href="#" style="margin-top:-22px;margin-left:590px;">意见反馈</a>
        <img src="img/erweima.jpg" style="width:70px;margin-left:800px;margin-top:-56px;">
        <p style="margin-left:440px;">www.taojianzhi.com</br>网络版权归淘兼职所有</p>
    </div>
</div>

</body>
</html>